/**
 * Dear programmer:
 * When I wrote this code, only god and I knew how it worked.
 * Now, only god knows it!
 *
 * @author: Pegasus  Date: 2018-12-13 Time: 22:23
 *
 * 我的工单
 */

import React, {Component} from 'react';
import {
  SafeAreaView,
  View,
  Text,
  Image,
  TouchableOpacity,
  ScrollView,
  Modal
} from 'react-native';
import {connect} from 'react-redux';
import {COLOR_WHITE} from "../../../../constant/PHColors"
import {styles} from './WorkOrderScreen.Style'
import ImageAndTextCellView from "../../../../component/ImageAndTextCellView/ImageAndTextCellView"
import DividingLineViewComponent from "../../../../component/DividingLineViewComponent/DividingLineViewComponent"
import {doGetRepairRecordNewDefault} from "../CreateRepairWorkOrderScreen/Actions"
import {QmsRecordSummary} from "../../JobScreen/Actions";
import {FetchStatus} from "../../../../configuration/RequestConfiguration";
import {ReturnStatus} from "../../../../configuration/ReturnStatus";
import {doDisplayWarnMessage} from "../../../../component/Message/Action";
import User from "../../../../model/User/User";

class WorkOrderScreen extends Component {

  static navigationOptions = ({navigation}) => ({
    headerTitle: `我的工单`,
    headerRight: (
      <TouchableOpacity activeOpacity={0.9} onPress={
        // navigation.getParam('setModalVisible')
          ()=>{
              navigation.navigate('CreateRepairWorkOrderScreen')
          }
      }>
        <View style={{width: 80, height: 44, flexDirection: 'row', justifyContent: 'center', alignItems: 'center'}}>
          <Text style={{fontSize: 16, color: '#212121'}}>
            新建
          </Text>
        </View>
      </TouchableOpacity>
    )
  });

  // 构造
  constructor(props) {
    super(props);
    // 初始状态
    this.state = {
      modalVisible: false,
      RecordSummary:{},
    };
  }

  componentWillMount() {
    this.props.navigation.setParams({setModalVisible: this._setModalVisible});
  }

  componentWillReceiveProps(nextProps, nextContext): void {
      let {dispatch} = this.props;
      if (nextProps.onGetRecordSummary !== this.props.onGetRecordSummary && nextProps.onGetRecordSummary.fetchStatus === FetchStatus.Success) {
          if (nextProps.onGetRecordSummary.RETURN === ReturnStatus.Success) {
              let RecordSummary = nextProps.onGetRecordSummary;
              this.setState({
                  RecordSummary: RecordSummary,
              });
              console.log(RecordSummary)
          } else {
              dispatch(doDisplayWarnMessage(nextProps.onGetRecordSummary.MSG))
          }
      }
  }

  // 组件渲染后调用
  componentDidMount() {
      // this.props.navigation.navigate('MainNavigator');
      let {dispatch} = this.props;
      let str = {};
      dispatch(QmsRecordSummary(JSON.stringify(str)))
  }

  render() {
    return (
      <SafeAreaView style={styles.body}>

        <ScrollView style={styles.body}>

          <View style={styles.headerContainer}>
            <Text style={styles.headerText}>
              分配给我的工单
            </Text>
          </View>

          <TouchableOpacity activeOpacity={0.8} onPress={() => {
            this.props.navigation.navigate('ImmediateOrderScreen')
          }}>
            <ImageAndTextCellView title={'即时工单'} num={this.state.RecordSummary.myUnComplate}/>
          </TouchableOpacity>

            <DividingLineViewComponent lineHeight={1}/>

            <TouchableOpacity activeOpacity={0.8} onPress={() => {
                this.props.navigation.navigate('ImmediateOrderScreen',{"status":"待验收",})
            }}>
                <ImageAndTextCellView title={'待验收工单'} num={this.state.RecordSummary.unReview}/>
            </TouchableOpacity>

          {/*<DividingLineViewComponent lineHeight={1}/>

          <TouchableOpacity activeOpacity={0.8} onPress={() => {
          }}>
            <ImageAndTextCellView title={'定期工单'}/>
          </TouchableOpacity>

          <DividingLineViewComponent lineHeight={1}/>

          <TouchableOpacity activeOpacity={0.8} onPress={() => {
          }}>
            <ImageAndTextCellView title={'能耗工单'}/>
          </TouchableOpacity>

          <DividingLineViewComponent lineHeight={1}/>

          <TouchableOpacity activeOpacity={0.8} onPress={() => {
          }}>ImmediateOrderScreen
            <ImageAndTextCellView title={'培训工单'}/>
          </TouchableOpacity>*/}

          <View style={styles.headerContainer}>
            <Text style={styles.headerText}>
                我创建的工单
            </Text>
          </View>

          <TouchableOpacity activeOpacity={0.8} onPress={() => {
              User.getUser(user => {
                  if (user && user.token) {
                      this.props.navigation.navigate('ImmediateOrderScreen',{"status":"","condition":{"work_userid":"","create_user":user.userid,"create_depart":'',"type":''},})
                  }
              })

          }}>
            <ImageAndTextCellView title={'我创建的工单'}/>
          </TouchableOpacity>

        <View style={styles.headerContainer}>
            <Text style={styles.headerText}>
                本部门创建
            </Text>
        </View>

        <TouchableOpacity activeOpacity={0.8} onPress={() => {
            User.getUser(user => {
                if (user && user.token) {
                    this.props.navigation.navigate('ImmediateOrderScreen',{"status":"","condition":{"work_userid":"","create_user":"","create_depart":user.dep,"type":''},})
                }
            })

        }}>
            <ImageAndTextCellView title={'本部门创建的工单'}/>
        </TouchableOpacity>

          {/*<View style={styles.headerContainer}>*/}
            {/*<Text style={styles.headerText}>*/}
              {/*本部门创建*/}
            {/*</Text>*/}
          {/*</View>*/}

          {/*<TouchableOpacity activeOpacity={0.8} onPress={() => {*/}
            {/*this.props.navigation.navigate('DepartmentalRepairOrderScreen')*/}
          {/*}}>*/}
            {/*<ImageAndTextCellView title={'部门报修单'}/>*/}
          {/*</TouchableOpacity>*/}

        </ScrollView>

        <Modal onRequestClose={()=> this._requestClose()} transparent={true} visible={this.state.modalVisible}>
          <TouchableOpacity style={{flex: 1}} activeOpacity={1} onPress={this._setModalVisible}>
            <View style={styles.modalContainer}>
              <View style={styles.modalView}>
                <View style={styles.modalHeader}>
                  <Text style={styles.modalHeaderText}>
                    选择工单类型
                  </Text>
                </View>

                <TouchableOpacity style={styles.modalItemView} activeOpacity={0.8} onPress={() => {
                  this._setModalVisible();
                  this.props.navigation.navigate('CreateServiceOrderScreen')
                }}>
                  <View style={styles.modalItemView}>
                    <Text style={styles.modalItemText}>
                      服务工单
                    </Text>
                  </View>
                </TouchableOpacity>

                <DividingLineViewComponent lineHeight={1}/>

                <TouchableOpacity style={styles.modalItemView} activeOpacity={0.8} onPress={() => {
                  this._setModalVisible();
                  this.props.navigation.navigate('CreateRepairWorkOrderScreen')
                }}>
                  <View style={styles.modalItemView}>
                    <Text style={styles.modalItemText}>
                      报修工单
                    </Text>
                  </View>
                </TouchableOpacity>

                <DividingLineViewComponent lineHeight={1}/>

                <TouchableOpacity style={styles.modalItemView} activeOpacity={0.8} onPress={() => {
                  this._setModalVisible();
                }}>
                  <View style={styles.modalItemView}>
                    <Text style={styles.modalItemText}>
                      内务通知
                    </Text>
                  </View>
                </TouchableOpacity>
              </View>
            </View>
          </TouchableOpacity>
        </Modal>

      </SafeAreaView>
    )
  }

  _setModalVisible = () => {
    this.setState({
      modalVisible: !this.state.modalVisible
    })
  };

  _requestClose(){
      this.setState({
          modalVisible: false
      })
  }

}

const props = state => {
  return {
      onGetRecordSummary: state.onGetRecordSummary,
  }
}

export default WorkOrderScreen = connect(props)(WorkOrderScreen);